/* Page */
body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd, form, a, fieldset, input, th, td { border: 0; outline: none; margin: 0; padding: 0; }
ul { list-style: none; }
* { margin: 0; padding: 0; padding-left: 0; -webkit-padding-start: 0; -webkit-margin-before: 0; -webkit-margin-after: 0; }

.wrap { width: 960px; margin: 0 auto; }
.demo-container { padding: 20px 0; }
.demo-container h4 { font-size: 14px; margin: 0 0 5px 0; }

/* Mega Menu Styles */
.mega-menu ul, .mega-menu ul li { list-style: none; padding-left: 0px; }
.mega-menu ul { position: relative; padding: 0; margin: 0; }
.mega-menu ul li ul { display: none; }
.mega-menu .sub { display: none; }
.mega-menu .sub ul { display: block; }

.grey { float: left; margin-top: -7px; }

/* Reset code to remove theme inherent styling */
#mega-menu ul, #mega-menu li { list-style: none; padding: 0; margin: 0; }
#mega-menu ul { display: none; /* Hides non-mega links */ }
#mega-menu .sub ul { display: block; /* overrides above hide */ }

/* Main menu styles */
#mega-menu { width: 100%; height: 37px; position: relative; /* Important - required for positioning of mega menu */ font: normal 11px Arial, sans-serif; line-height: 11px; }
#mega-menu li { float: left; font-weight: bold; }
#mega-menu li a { float: left; display: block; padding: 12px 15px; color: #9A9A9A; text-decoration: none; text-transform:uppercase; }
#mega-menu li.mega-hover a, #mega-menu li a:hover { background-position: 100% -40px; background-color:#F3F3F3; color: #9A9A9A; text-shadow: none; }

/* Arrow tag for parent links */
#mega-menu li a.dc-mega { padding-right: 38px; /* Additional padding for arrow */ position: relative; /* Required for arrow positioning */ }
#mega-menu li a .dc-mega-icon { display: block; position: absolute; top: 18px; right: 15px; width: 8px; height: 6px; background: url(images/arrow.png) no-repeat 0 0; }
#mega-menu li.mega-hover a .dc-mega-icon { background-position: 0 100%; }

/* Mega Menu Styling */
/* Mega Drop Down Container */
#mega-menu li .sub-container { position: absolute; /* Required */ background: url(images/bg_sub_left.png) no-repeat 0 100%; padding-left: 10px; margin-left: -3px; }
#mega-menu li .sub { background: url(images/bg_sub.png) no-repeat 100% 100%; padding: 15px 15px 15px 5px; }
#mega-menu li .sub-container.mega .sub { padding: 20px 10px 0 0; }
#mega-menu li .sub .row { /* Clear the sub-menu floats */ width: 100%; overflow: hidden; clear: both; }
#mega-menu li .sub li { float: none; font-size: 1em; font-weight: bold; }
/* Sub-menu Headers */
#mega-menu li .sub li.mega-hdr { /* Sub-menu headers - i.e. 2nd level navigation */ float: left; /* Float the sub-menus and give them a fixed width to from the mega menu rows */ width: 225px; margin: 0 10px 10px 10px; text-align:left;}
#mega-menu li .sub a { /* Clear the styles from the top-level links and set the font styles */ background: none; border: none; text-shadow: none; color: #111; padding: 7px 10px; display: block; float: none; text-decoration: none; font-size: 0.9em; }
#mega-menu li .sub li.mega-hdr a.mega-hdr-a { padding: 7px 10px; margin-bottom: 5px; border-bottom: 1px solid #ccc; text-transform: uppercase; font-weight: bold; color: #000; background: #EAEAEA url(images/bg_hdr.png) repeat-x center center; }
#mega-menu li .sub li.mega-hdr a.mega-hdr-a:hover { color: #000; text-shadow: none; }

/* Add the individual sub-menu backgrounds */
#mega-menu li .sub li#menu-item-1 { background: url(images/kettle.jpg) no-repeat 135px 40px; }
#mega-menu li .sub li#menu-item-2 { background: url(images/baratza.jpg) no-repeat 135px 40px; }
#mega-menu li .sub li#menu-item-3 { background: url(images/vac_pot.jpg) no-repeat 135px 40px; }
#mega-menu li .sub li#menu-item-4 { background: url(images/bg_suv.jpg) no-repeat 135px 40px; }
#mega-menu li .sub li#menu-item-5 { background: url(images/bg_pickup.jpg) no-repeat 135px 40px; }
#mega-menu li .sub li#menu-item-6 { background: url(images/bg_sports.jpg) no-repeat 135px 40px; }

/* Style the 3rd level links */
#mega-menu li .sub li ul li { margin-right: 10px; text-align:left;}
#mega-menu .sub li.mega-hdr li a { color: #444; font-weight: normal; padding: 3px 0 3px 15px; background: url(images/bullet.png) no-repeat 6px 5px; }
#mega-menu .sub li.mega-hdr li a:hover { color: #EC6C04; background-image: url(images/bullet_n.png); }

/* Styling for items with only 2 levels */
#mega-menu li .sub-container.non-mega .sub { padding: 20px 20px 20px 10px; }
#mega-menu li .sub-container.non-mega li { width: 190px; /* Set the drop down width */ }
#mega-menu li .sub-container.non-mega li a { padding: 7px 5px 7px 22px; background: url(images/bullet.png) no-repeat 6px 5px; }
#mega-menu li .sub-container.non-mega li a:hover { color: #EC6C04; background-image: url(images/bullet_n.png); }
